<?php
/**
 * The Template for displaying a single posts.
 *
 * @file      single.php
 * @package   pncm
 * @author    Ambient digital.
 * @link 	  http://ambientdigital.com
 */
 
?>
<?php get_header(); ?>

<script>
	var num = 148; //number of pixels before modifying styles

	$(window).bind('scroll', function () {
		if ($(window).scrollTop() > num) {
			$('.video-nav').addClass('cate-menu-fixed');
		} else {
			$('.video-nav').removeClass('cate-menu-fixed');
		}
	});
</script>
<div class="wrapper">
		<div class="container">
			<div class="video-nav hidden-md hidden-sm hidden-xs">
				<ul>
                <?php $cate_name = get_category_by_slug("video"); ?>
                    <li> <a href="<?php echo esc_url( home_url( '/' ) ); ?>chuyen-muc/video"> Tất cả </a></li>
                    <?php 
                        $args = array(
                            'child_of'    =>$cate_name->term_id,
                            'title_li'     =>''
                        );
                    wp_list_categories( $args ); ?> 
                    <!--li> <a href="#"> Tất cả </a></li>
					<li> <a href="#"> Clip hài </a></li>
					<li> <a href="#"> Âm nhạc</a></li>
					<li> <a href="#"> Phim ảnh </a></li>
					<li> <a href="#"> Làm đẹp </a></li>
					<li> <a href="#"> Ẩm thực </a></li>
					<li> <a href="#"> Show thời trang </a></li>
					<li> <a href="#"> Game show </a></li-->
				</ul>
					
			</div><!--End navigation-->
            
            <div class="menu-select-box">
			<select>
        	  <option value="/tat-ca">Tất cả</option>
        	  <option value="/video/hai">Hài</option>
        	  <option value="/video/hoat-hinh">Hoạt hình</option>
        	  <option value="/video/lam-dep">Làm đẹp</option>
        	  <option value="/video/mon-ngon">Món ngon</option>
        	  <option value="/video/nhac">Nhạc</option>
        	  <option value="/video/phim">Phim</option>
			</select>
			</div>
                
	</div><!--End container-->
</div><!--End wrapper-->
<div class="clear"> </div>

<?php $category = get_the_category(); ?>
<div class="content">
		<div class="wrapper">
			<div class="container">
                 <?php if (have_posts()) { ?>		
                 <?php   while (have_posts()) : the_post();?>
                    <div id="content_temp" class="full-width-md full-width-sm full-width-xs" style="display: none; width: 100%; height: 587px;">
                        <?php the_content(); ?>
                    </div>
                    <div id="yplayer"></div>
                    <script>
                        jQuery(function(){
                            var video_iframe = $('#content_temp').find('iframe');
                            var player_height = $('#content_temp').height();
                            if(video_iframe.length>0) {
                                var video_src = $('#content_temp iframe').attr('src');
                                console.log(video_src);
                                var youtube = video_src.match(/youtube.com\/embed\/([^\/&]+)/i);
                                console.log(youtube);
                                if(youtube) {
                                    console.log('Youtube id: '+youtube[1]);
                                    jwplayer('yplayer').setup({
                    					'flashplayer': '<?php echo get_template_directory_uri();?>/flash/player.swf',
                    					'file': 'https://www.youtube.com/watch?v='+youtube[1],
                    					'controlbar': 'bottom',
                    					'width': '100%',
                    					'height': player_height,
                    					"plugins": 'http://media.adnetwork.vn/flash/jwplayer/ova-jw.swf',
                    					"config": 'http://delivery.adnetwork.vn/247/ovavideoad/wid_1336101208/zid_1336102010/'
                				  });
                                } else {
                                    console.log('Not youtube video');
                                    $('#content_temp').show();
                                    $('#content_temp iframe').width('100%');
                                    
                                    $('#content_temp iframe').height(player_height);
                                }    
                            } else {
                                console.log('No iframe embed!');
                                $('#content_temp').show();
                                $('#content_temp object').width('100%');
                                
                                $('#content_temp object').parent().height(player_height);
                            }
                            
                        });
                    </script>
                            
            		<div class="play-video-caption">
                        <div class="breadcrum">
                          <a href="<?php echo esc_url( home_url( '/' ) ); ?>chuyen-muc/video"> <?php echo  ($category[0]->category_parent > 0)? "<h4>".get_cat_name($category[0]->category_parent)."<i class='bread-brea'></i> </h4>" : ""; ?>   </a>
                          <a href="<?php echo esc_url( get_category_link( $category[0]->term_id ) ); ?>"><span> <?php  echo $category[0]->cat_name;?></span></a>
                        </div>
                        <div class="clear"> </div>
            			<h1> <?php the_title()?></h1>
                        					
            			<div class="social-util">
            			 <iframe src="http://www.facebook.com/plugins/like.php?href=<?php esc_url(the_permalink())?>;width&amp;layout=button_count&amp;action=like&amp;show_faces=true&amp;share=true&amp;height=24" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:24px;" allowtransparency="true"></iframe>
            			</div>
			         </div>
                 
                 <?php setPostViews(get_the_ID()); endwhile; }?>
				
			</div><!--End container-->
		</div><!--End feature-wrap-->
		<div class="clear"> </div>
		<div class="wrapper">
			<div class="container">
				<div class="banner-bottom-block hidden-sm hidden-xs">
					<div class="banner banner-728x90">
						<a href="#"> <img src="<?php echo get_template_directory_uri() ?>/images/banner_728x90.png" id="mouse-banner" alt="banner_728x90"/></a>
					</div>
					<div class="banner banner-300x250">
						<a href="#"> <img src="<?php echo get_template_directory_uri() ?>/images/banner_300x250.png" class="hide-banner" alt="logo"/></a>
					</div>
				</div>
			</div><!--End container-->
		</div><!--End wrapper-->
		<div class="clear"> </div>
		<div class="wrapper">
			<div class="container">
				<div class="block-head vde-blo-head">
					<div class="line-2"></div>
						<h1 class="two-word"> XEM TIẾP </h1>
					<div class="line-2"></div>
				</div>
				<ul class="video_lg-li large-items-list">
                <?php   $postID_exclude = array(); array_push($postID_exclude,get_the_ID());
                                    $args = array(
                                        'cat'                 => $category[0]->term_id,
                                        'post_type'           => 'video',
                                        'post__not_in'        => $postID_exclude,
                                        'posts_per_page'      => 15,
                                        'orderby'             =>  'meta_value_num',
                                        'order'               => 'DESC',
                                    );
                                $the_query = new WP_Query($args);
                                // The Loop
                                if ( $the_query->have_posts() ) {
                                	
                                	while ( $the_query->have_posts() ) {
                                		$the_query->the_post();
                                        array_push($postID_exclude,get_the_ID()); 
                                        ?>
                                        <li>
                    						<div class="news-item" style="position: absolute;"> 
                    							<a href="<?php esc_url(the_permalink())?>" style="background:url(<?php echo get_bg_image(get_the_ID());?>) no-repeat; background-size: cover;" class="img"><img src="<?php echo get_bg_image(get_the_ID());?>" alt="<?php the_title() ?> "/></a>
                    							<a href="<?php esc_url(the_permalink())?>" class="video-cover"></a>
                    							<a href="<?php esc_url(the_permalink())?>"><?php the_title() ?> </a>
                    							<span class="time"> 12: 00</span>
                    						</div>
                    					</li>
	                       <?php }} wp_reset_postdata(); ?>
                           
				</ul>
				<!--div class="block-row">
					<a href="#" class="view_more_listnews">Xem thêm</a>
					<div class="paginator">
						<ol class="wp-paginate">
							<li><a href="#" class="next"><img src="images/arrow-left.png"></a></li>
							<li><span class="page current">1</span></li>
							<li><a href="#" title="2" class="page">2</a></li>
							<li><a href="#" title="3" class="page">3</a></li>
							<li><a href="#" title="4" class="page">4</a></li>
							<li><a href="#" title="5" class="page">5</a></li>
							<li><a href="#" class="next"><img src="images/arrow-right.png"></a></li>
						</ol>
					</div>
				</div-->
			</div>
		</div>
		
	</div><!--End content-->
 <?php get_footer(); ?>